<template>
  <div>
    <h3>son组件</h3>
    <!-- <router-link :to='`/son/grandson?id=${m.id}&content=${m.content}`' v-for='m in messageList' :key='m.id'>grandson:{{m.title}}</router-link> -->
    <!-- 第二种写法： -->
    <router-link
      v-for='m in messageList'
      :key='m.id'
      :to='{
      path:"/son/grandson",
      query:{
          id:m.id,content:m.content
        },
      }'
    >{{m.title}}&nbsp;&nbsp;&nbsp;</router-link>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  name: "Son",
  data() {
    return {
      messageList: [
        { id: 0, content: "信息一", title: "1" },
        { id: 1, content: "信息2", title: "2" },
        { id: 2, content: "信息3", title: "3" },
      ],
    };
  },
};
</script>

<style>
</style>